<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="./jquery.js"></script>
  </head>
  <body>
    <div>
      <h1>注册</h1>
      用户名：<input type="text" name="" id="username" />
      <br />
      密&nbsp;&nbsp;&nbsp;码：<input type="password" name="" id="pwd" /><br />
      邮&nbsp;&nbsp;&nbsp;箱：<input type="email" name="" id="email" /><br />
      <input type="button" value="注册" id="reg" />
      <div id="pop"></div>
      <p id="jump"></p>
    </div>
    <div>
      <h1>登录</h1>
      用户名：<input type="text" name="" id="login-username" /> <br /><br />
      密&nbsp;&nbsp;&nbsp;码:
      <input type="password" name="" id="login-pwd" />
      <input type="button" value="login" id="login" />
    </div>
  </body>
  <script>
    $(function () {
      $('#reg').click(function () {
        var username = $('#username').val(),
          pwd = $('#pwd').val(),
          email = $('#email').val()
        if (!username || !pwd || !email) {
          alert('输入错误')
          return
        }
        $.ajax({
          url: 'https://liu.zzgoodqc.cn/register',
          method: 'POST',
          dataType: 'json',
          data: {
            username: username,
            password: pwd,
            email: email,
          },
          success: function (res) {
            console.log(res)
            if (res.code == 200) {
              var num = 3
              $('#jump').html('3s后自动跳转到登录...')
              setInterval(() => {
                $('#jump').html(--num + 's后自动跳转到登录...')
              }, 1000)
              $('#pop').html(res.msg + ' 您的用户ID是：' + res.data.id)
              setTimeout(function () {
                $('div').eq(2).show()
                $('div').eq(0).hide()
              }, 3000)
            }
          },
        })
      })

      //登录
      $('#login').click(function () {
        var username = $('#login-username').val(),
          pwd = $('#login-pwd').val()
        $.ajax({
          url: 'https://liu.zzgoodqc.cn/login',
          method: 'POST',
          dataType: 'json',
          data: {
            username: username,
            password: pwd,
          },
          success: function (res) {
            console.log(res)
            if (res.code == 200) {
              alert(res.msg)
            } else {
              alert('登录失败' + res.msg)
            }
          },
        })
      })
    })
  </script>
</html>
